<template>
<view class="dity">
    <view class="dity-item" v-for="(item,index) of array" :key="index">
		<image class="dity-img" :src="item.url" mode=""></image>
		
		<view class="dity-price">
			<text class="price">￥{{item.price}}</text>
			<text class="oprice">￥{{item.oprice}}</text>
		</view>
		<view class="dity-content">
			<text class="dity-name">{{item.name}}</text>
		</view>
	</view>   
</view>

</template>
<script>
export default{
    data(){
        return{
            
        }
    },
    props:["array"]
} 
</script>
<style>
	.dity{
		display: flex;
		flex-wrap: wrap;
	}
	.dity-item{
		width: 355rpx;
		padding: 5rpx 5rpx 5rpx 5rpx;
		border: 5rpx solid #999999;
	}
	.dity-img{
		width: 100%;
		height: 375rpx;
	}
	.dity-content{
		/* text-align: center; */
		padding-bottom: 30rpx;
	}
	.dity-name{
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		color: #333333;
		word-break: break-all;
		font-size: 32rpx;
		padding: 6rpx;
		
	}
	.price{
		color: crimson;
		font-size: 36rpx;
	}
	.oprice{
		text-decoration: line-through;
		font-size: 24rpx;
		color: #999999;
		padding-left: 20rpx;
	}
	.dity-price{
		padding-bottom: 20rpx;
	}
</style>
